<script type='text/javascript'>
	function update() {
		app.post('/services/invoices/update/{{invoice.number}}', {
			company   : $('#company').val(),
			comments  : $('#comments').val(),
			startDate : $('#startDate').val(),
			endDate   : $('#endDate').val(),
			hours     : $('#hours').val(),
			rate      : $('#rate').val(),
			taxRate   : $('#taxRate').val(),
			sent      : $('#sent')[0].checked,
			paid      : $('#paid')[0].checked		
		},function(result){
			if(result == 'ok') {
				app.load('/services/invoices');
			}
			else{
				alert(result);
			}
		});
	}
	$(document).ready(function(){
		$('#company').val('{{invoice.company}}')
	});
</script>

<div id='menu'>
	<ul>
		<li><a href='javascript:app.load("/services/invoices")'>go back</a></li>
	</ul>
</div>

<div id='content'>

	<h1>update invoice</h1>	

	<fieldset>
		<div class='field-row'>
			<label>company</label>
			<select id='company'>
				{% for company in companies %}
					<option value='{{company.slug}}'>{{company.name}}</option>
				{% endfor %}
			</select>
		</div>
		<div class='field-row'>
			<label>created on</label>
			<span>{{invoice.created|date:"D d M Y" }}</span>
		</div>
		<div class='field-row'>
			<label>number</label>
			<span>{{invoice.number}}</span>
		</div>
		<div class='field-row'>
			<label>start</label>
			<input type='text' id='startDate' class='date-field' value='{{invoice.startDate.date}}' /> 
		</div>
		<div class='field-row'>
			<label>end</label>
			<input type='text' id='endDate' class='date-field' value='{{invoice.endDate.date}}' />
		</div>
		<div class='field-row'>
			<label>comments</label>
			<textarea id='comments'>{{invoice.comments}}</textarea>
		</div>	
		<div class='field-row'>
			<label>hours</label>
			<input type='text' id='hours' class='numeric-field' value='{{invoice.hours}}' />
		</div>
		<div class='field-row'>
			<label>rate</label>
			<input type='text' id='rate' class='numeric-field' value='{{invoice.rate}}' />
		</div>
		<div class='field-row'>
			<label>taxRate</label>
			<input type='text' id='taxRate' class='numeric-field' value='{{invoice.taxRate}}' />
		</div>

		<div class='field-row'>
			<label>sent</label>
			{% if invoice.sent %}
				<input type='checkbox' id='sent' checked />
			{% endif %}
			{% if not invoice.sent %}
				<input type='checkbox' id='sent' />
			{% endif %}

		</div>
		
		<div class='field-row'>
			<label>paid</label>
			{% if invoice.paid %}
				<input type='checkbox' id='paid' checked />
			{% endif %}
			{% if not invoice.paid %}
				<input type='checkbox' id='paid' />
			{% endif %}
		</div>
		
		<div class='field-row'>
			<label>&nbsp;</label>
			<a href='javascript:update()'>update</a>

		</div>	
	</fieldset>
		
</div>